$lg: 1920px;
$md: 1366px;
$md-principles: 1440px;

@mixin media-breakpoint-overflow($breakpoint, $content) {
  @media screen and (max-width: #{ $breakpoint - 0.02px }) {

    @each $key,
    $value in $content {
      #{$key}: #{$value};
    }
  }
}

@mixin media-breakpoint-down($breakpoint, $content) {
  @media screen and (max-width: #{ $breakpoint }) {

    @each $key,
    $value in $content {
      #{$key}: #{$value};
    }
  }
}

@mixin media-breakpoint-up($breakpoint, $content) {
  @media screen and (min-width: #{ $breakpoint }) {

    @each $key,
    $value in $content {
      #{$key}: #{$value};
    }
  }
}
